<template>
  <view class="login-container">
    <view class="logo-section">
      <image src="@/static/logo.png" class="app-logo" mode="aspectFit" />
    </view>

    <button class="login-btn" open-type="getUserInfo" @getuserinfo="handleLogin" @click="handleLogin">
      <text>微信一键登录</text>
    </button>
  </view>
</template>

<script setup lang="ts">
import { useUserStore } from '@/store/user';

const userStore = useUserStore();

const handleLogin = async () => {
  try {
    await userStore.wechatLogin();
    uni.switchTab({
      url: '/pages/index/index',
    });
  } catch (error) {
    console.error('Login failed:', error);
  }
};
</script>

<style lang="scss">
.login-container {
  display: flex;
  flex-direction: column;
  align-items: center;
  padding: 100rpx 40rpx;

  .logo-section {
    margin-bottom: 100rpx;

    .app-logo {
      width: 200rpx;
      height: 200rpx;
    }
  }

  .login-btn {
    width: 80%;
    height: 90rpx;
    display: flex;
    align-items: center;
    justify-content: center;
    background: #07c160;
    border-radius: 45rpx;
    color: white;
    font-size: 32rpx;

    .wechat-logo {
      width: 50rpx;
      height: 50rpx;
      margin-right: 20rpx;
    }
  }
}
</style>
